import React, { Component } from 'react';
import { connect } from 'dva';
import { Link, routerRedux } from 'dva/router';
import {  WhiteSpace,
    WingBlank,
    Toast,
    Tabs,
    Flex,
    Icon,
    ListView,
    SegmentedControl,
    Button} from 'antd-mobile';
import MyScroll from '../../components/MyScroll/MyScroll';
import NoLazyImg from '../../components/NoLazyImg/NoLazyImg';
import OrderItem from "./orderItem";
import MyListView from '../../components/MyListView/MyListView';
import NavTopBar from '../../components/NavTopBar/NavTopBar';
import dianpusvg from "../../assets/img/dianpu.svg";
import xiaoxi from "../../assets/svg/xiaoxi.svg";





class EvaluateAndAfter extends Component {

    constructor(props) {
        super(props);
        this.state = {
            idx:this.props.match.params.idx,
            title:this.props.match.params.idx==0?"评价商品列表":"售后商品列表"
        };
    }


    componentDidMount(){
        this.props.dispatch({type: "orderList/OrderDetailEFF", obj: this.props.match.params.data})
    }



    render() {

        const {orderGoodsEntityList=[]}=this.props.orderList.orderDetail;
        const {idx,title}=this.state;
        console.log(orderGoodsEntityList)
        return (
            <Flex direction="column" >
                <NavTopBar title={title} dispatch={this.props.dispatch} />
                <div style={{background:"#fff",width:"100%"}}>
                    <WingBlank>
                        {orderGoodsEntityList.map((item,i)=>{
                            return <div key={i}>
                                <Flex style={{padding:".2rem 0"}} key={i} onClick={()=>{
                                    this.props.dispatch(routerRedux.push({
                                        pathname: `/orderDetail/${item.orderId}`,
                                    }));
                                }}>
                                    <div style={{width:"2rem",height:"2rem",marginRight:".2rem"}}>
                                        <NoLazyImg src={item.goodsImage} style={{width:"2rem",height:"2rem"}}/>
                                    </div>

                                    <div>
                                        <p style={{lineHeight:".4rem",marginBottom:".5rem"}}>{item.goodsName}</p>
                                        <p style={{color:"#999"}}>{item.specInfo}</p>
                                    </div>
                                </Flex>
                                <WhiteSpace></WhiteSpace>
                                <Flex justify='between'>
                                    <Flex>
                                        <div style={{marginRight:".15rem"}}>共 <span>{item.goodsNum}</span>件商品</div>
                                        <div >实付款: {`￥${item.goodsPayPrice }`}</div>
                                    </Flex>
                                    {
                                        idx==0?<div className="orderItemBtn">
                                            {item.evaluationStatus==0?<Button style={{marginLeft: '0.1rem',borderRadius:".45rem"}}  size='small' inline onClick={()=>{
                                                this.props.dispatch(routerRedux.push({
                                                    pathname:`/evaluate/${item.orderId}/${i}/${1}`
                                                }))
                                            }}>去评价</Button>:item.isAddComment==0?<Button style={{marginLeft: '0.1rem',borderRadius:"45px"}}  size='small' inline onClick={()=>{
                                                this.props.dispatch(routerRedux.push({
                                                    pathname:`/evaluate/${item.orderId}/${i}/${item.evaluationId}`
                                                }))
                                            }}>追加评价</Button>: <Button style={{marginLeft: '0.1rem',borderRadius:".45rem"}} disabled size='small' inline >已评价</Button>}
                                        </div>:<div className="orderItemBtn">
                                                {item.returnId==""?<Button style={{marginLeft: '0.1rem',borderRadius:".45rem"}}  size='small' inline onClick={()=>{
                                                    this.props.dispatch(routerRedux.push({
                                                        pathname:`/applyAfterSale/${item.orderId}/${i}`
                                                    }))
                                                }}>申请售后</Button>:<Button style={{marginLeft: '0.1rem',borderRadius:".45rem"}}  size='small' inline onClick={()=>{
                                                    this.props.dispatch(routerRedux.push({
                                                        pathname:`/returnDetail/${[item.returnId,item.type]}`
                                                    }))
                                                }}>售后查询</Button>}

                                        </div>
                                    }

                                </Flex>
                                <WhiteSpace></WhiteSpace>
                            </div>

                        })}
                    </WingBlank>
                </div>


            </Flex>
        );
    }
}


export default connect(({ orderList }) => ({ orderList }))(EvaluateAndAfter);
